<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>动画</title>
        <link type="text/css" rel="stylesheet" href="css/scene.css">
    </head>
    <body>
        <div id="warp">
            <h1>transform+transition实现旋转放缩动画</h1>
            <div id="main">
                <div>
                    <h5>旋转与放缩</h5>
                    <img src="source/2-4/nwafu.png" alt="nwafu.png" class="b1" style="width: 100%">
                </div>
                <div>
                    <h5>位置移动</h5>
                    <div class="b2">
                        <img src="source/2-4/OIP-C.jpg" alt="" style="height: 40%;width: 60%">
                    </div>
                </div>
                <div>
                    <h5>翻转</h5>
                    <div class="b3">
                        <img src="source/2-4/R-C.jpg" alt="">
                        <img src="source/2-4/OIP-C (1).jpg" alt="">
                    </div>
                </div>
                <div>
                    <h5>关键帧动画</h5>
                    <a href="keyframes_pic.html">点击此链接打开动画文件</a>
                </div>
            </div>
        </div>
    </body>
</html>